<template>
  <v-form v-model="valid" ref="myOrderForm">
    <v-layout horizontal>
      <v-flex xs12 sm12 md12>
        <v-layout>
          <v-text-field v-model="Order.lsh" label="流水号" disabled required />
          <v-text-field v-model="Order.hh"  @change="search" label="请输入货号" required disabled />
          <v-select
            v-model="Order.lx"
            :items="lxs"
            item-text="text"
            item-value="value"
            label="类型"
            required disabled
          ></v-select>
          <v-text-field v-model="Order.sl" label="请输入数量" required disabled/>
        </v-layout>
        <v-layout>
          <v-text-field v-model="Order.sdsj" label="送达时间" disabled  />
          <v-text-field
            v-model="Order.driverName"
            label="司机"
            disabled
          />
          <v-text-field v-model="Order.pathName" label="路线" disabled />
          <v-text-field v-model="Order.statusInfo" label="状态" disabled />
        </v-layout>
        <v-layout>
          <v-text-field v-model="Order.contact" label="请输入联系人" required disabled/>
          <v-text-field v-model="Order.phone" label="请输入联系方式" required disabled />
          <v-text-field v-model="Order.qwsj" label="请输入送货时间" required  disabled/>
        </v-layout>

        <v-layout>
          <v-text-field v-if="false" disabled>{{Order.province+''+Order.city+''+Order.district}}</v-text-field>

          <v-text-field v-model="Order.location" label="请输入详细地址" required disabled />
        </v-layout>

        <v-layout class="my-4" row>
          <v-spacer />
          <!-- <v-btn v-if="this.isEdit" @click="submit" color="primary">提交</v-btn> -->
          <!-- <v-btn v-if="!this.isEdit" @click="save" color="primary">保存</v-btn> -->
          <!-- <v-btn v-if="this.isEdit" @click="save" color="primary">作废</v-btn> -->
          <!-- <v-btn v-if="!this.isEdit" @click="clear">重置</v-btn> -->
        </v-layout>
        <v-layout horizontal>
          <v-text-field v-model="Order.pinm" label="品名" disabled></v-text-field>
          <v-text-field v-model="Order.xingh" label="型号" disabled></v-text-field>
        </v-layout>
     
      </v-flex>

      <!-- 商品信息
      -->
    </v-layout>
  </v-form>
</template>

<script>
export default {
  name: "Rorder-form",
  props: {
    oldOrder: {
      type: Object
    },
    isEdit: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      valid: false, //
      Order: {
        name: "", //
        code: "", //
        id: "", //
        status: 0, //
        district: "",
        pinm: "",
        xingh: "",
        zhongl: ""
      },
      lxs: [
        { text: "正品", value: 0 },
        { text: "样机", value: 1 },
        { text: "赠品", value: 2 },
        { text: "残次", value: 3 }
      ],
      nameRules: [
        v => !!v || "路线名称不能为空",
        v => v.length > 1 || "路线名称至少2位"
      ],
      checkbox: false,
      sp: {
        hh: "",
        pinm: "",
        chang: "",
        kuan: "",
        gao: "",
        xingh:"",
        zhongl: ""
      },
    };
  },
  methods: {

   
    search(hh) {
      this.sp.hh = Number(hh);
      this.$http({
        method: "get",
        url: "item/item/queryhh?hh=" + hh,
        headers: {
          "Content-Type": "application/json;charset=UTF-8"
        }
      })
        .then(resp => {
          // 关闭窗口
          this.sp = resp.data;
        })
        .catch(() => {
          this.sp = {};
        });
    },
    clear() {
      // 重置表单
      this.$refs.myOrderForm.reset();
    },
   
  },
  watch: {
    oldOrder: {
      // 监控oldOrder的变化
      handler(val) {
        if (val) {
          // 注意不要直接复制，否则这边的修改会影响到父组件的数据，copy属性即可
          this.Order = Object.deepCopy(val);
          this.Order.statusInfo = "新增";
        } else {
          // 为空，初始化brand
          this.Order = {
            name: "",
            code: "",
            id: "",
            area: "",
            status: 0,
            statusInfo: "新增",
            pinm: "",
            xingh: "",
            zhongl: ""
          };
        }
      },
      deep: true
    }
  }
};
</script>

<style scoped>
</style>
